<template>
    <div>
        <dialog-edit :visible.sync="dialogVisible" :title="$attrs.title" ref="userManageEdit" width="1000"
                     height="380" @save="save" :loading="loading">
            <template slot="body">
                <dym-form :formData="formData" :components="components" :formRules="formRules" ref="dymForm">
                    <template slot="Projuserid" slot-scope="scope">
                        <select-project-team v-model="scope.row.Projuserid" placeholder="请选择项目负责人"></select-project-team>
                    </template>
                </dym-form>
            </template>
        </dialog-edit>
    </div>
</template>

<script>
    import dialogEdit from '@/components/element/dialogEdit'
    import dymForm from '@/components/element/dymForm'
    import projectModuleApi from '@/api/projectModuleApi';
    import SelectProjectTeam from "@/components/element/select/SelectProjectTeam";

    export default {
        components: {
            dialogEdit,
            dymForm,
            SelectProjectTeam
        },
        computed: {
            dialogVisible: {
                get: function () {
                    return this.visible
                },
                set: function (value) {
                    this.$emit('update:visible', value)
                }
            }
        },
        props: {
            visible: {
                type: Boolean,
                default() {
                    return false;
                }
            },
            formData: {
                type: Object,
                default() {
                    return {};
                }
            },
            editModel: {
                type: String,
                default() {
                    return '';
                }
            }
        },
        data() {
            return {
                loading: false,
                activeNames: ['1', '2'],
                components: [
                    {
                        label: '名称',
                        span: 24,
                        placeholder: '请输入名称',
                        prop: 'Name',
                        value: 'Name',
                        componentName: 'vxe-input'
                    },
                    {
                        label: '模块别名',
                        span: 24,
                        placeholder: '请输入模块别名',
                        prop: 'Aliasname',
                        value: 'Aliasname',
                        componentName: 'vxe-input'
                    },
                    {
                        label: '描述',
                        span: 24,
                        placeholder: '请输入描述',
                        prop: 'desc',
                        value: 'desc',
                        componentName: 'vxe-textarea',
                        autosize: {
                            minRows: 5
                        }
                    },
                    {
                        label: '项目负责人',
                        span: 24,
                        placeholder: '请选择项目负责人',
                        prop: 'Projuserid',
                        value: 'Projuserid',
                        slot: true
                    }
                ],
                formRules: {
                    Name: [
                        {required: true, message: '请输入名称'},
                    ]
                },
                init: false
            }
        },
        methods: {
            save() {
                this.$refs.dymForm.$refs.form.validate().then(() => {
                    if (this.formData.Id !== '') {
                        projectModuleApi.modify(this.formData).then(res => {
                            this.$XModal.message({message: res.message, status: res.code === 1 ? 'success' : 'error'})
                            this.$emit('search')
                            if (res.code === 1) this.dialogVisible = false
                        })
                    } else {
                        projectModuleApi.create(this.formData).then(res => {
                            this.$XModal.message({message: res.message, status: res.code === 1 ? 'success' : 'error'})
                            this.$emit('search')
                            if (res.code === 1) this.dialogVisible = false
                        })
                    }
                }).catch(() => {
                    this.$XModal.message({message: '表单填写错误，请检查', status: 'error'})
                })
            }
        },
        watch: {
            'visible': {
                handler(val) {
                    this.loading = true
                    this.init = true
                    if (val && this.$refs.dymForm !== undefined) {
                        this.$refs.dymForm.$refs.form.clearValidate()
                    }
                    setTimeout(() => {
                        this.loading = false
                    }, 300)
                }
            }
        }
    }
</script>

<style scoped>

</style>